<template>
  <div>这是个人信息管理界面，可以查看或修改个人信息{{object.age}}</div>

  <div>
    <p>this is {{age}}</p>
    <input type="text" v-model="age"/>
    <div>这是个人信息管理界面，可以查看或修改个人信息{{num}}</div>
    <button @click="sub">+</button>


    <div>这是个人信息管理界面，可以查看或修改个人信息{{object.age}}</div>
    <input v-model="num"/>
    {{age}}
  </div>
  <div class="container">
    姓名：<input size="20" placeholder="请输入" @input="search($event)"/>
    <button @click="search($event)">change</button>
  </div>
</template>

<script>
let data = {
  num:0,
  object:{
    name:'hahahahaha',
    age : 1,
  }
}
export default {
  data(){
     return{
       data,
     }

  },
  methods:{
    sub(){
      this.object.age = 100
    },
    search(event){
      this.object.age = event.currentTarget.value;
    }
  }

}
</script>

<style scoped>
.container{
  background: aqua;
  width: 60%;
  height: auto;
  margin-left: 20%;
}
</style>